import {createContext, useContext, useReducer} from "react";
import type {ContextType, PropsType} from "@/types/commonType.ts";
import type {LayoutStateType} from "@/types/layoutType.ts";
import {layoutState} from "@/context/initialState/layoutState.ts";
import {layoutReducer} from "@/context/reducer/layoutReducer.ts";

const LayoutContext = createContext<ContextType<LayoutStateType>>({state: layoutState, dispatch: () => null})

export const LayoutProvider = (props: PropsType) => {
    const [state, dispatch ] = useReducer(layoutReducer, layoutState)

    return (
        <LayoutContext.Provider value={{state, dispatch}}>
            {props.children}
        </LayoutContext.Provider>
    )
}

export const useLayout = () => {
    return useContext(LayoutContext)
}